<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>注册</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">

<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.9.2.js"></script>
<script type="text/javascript" src="js/registCheck.js"></script>
<script type="text/javascript" src="js/SecurityCode.js"></script>


<script type="text/javascript" src="js/jquery.idealforms.js"></script>

<link href="css/normalize.css" rel="stylesheet"/>
<link href="css/jquery-ui.css" rel="stylesheet"/>
<link href="css/jquery.idealforms.min.css" rel="stylesheet" media="screen"/>

<style type="text/css">
body{font:normal 15px/1.5 Arial, Helvetica, Free Sans, sans-serif;color: #222;background:url(images/pattern.png);overflow-y:scroll;padding:60px 0 0 0;}
#my-form{width:755px;margin:0 auto;border:1px solid #ccc;padding:3em;border-radius:3px;box-shadow:0 0 2px rgba(0,0,0,.2);}
#comments{width:350px;height:100px;}
</style>

</head>

<body>

<div class="row">

  <div class="eightcol last">

    <!-- Begin Form -->

    <form name="myform" action="registerValidate" method="post" id="my-form">

        <section name="必填栏目">

          <div>
          	<label>用户名:</label><input id="username" name="username" type="text"/>

          </div>
          <div><label>密码:</label><input id="pass" name="password" type="password"/></div>
          <div><label>重复密码:</label><input id="confirmPassword" name="confirmPassword" type="password"/></div>
          
          <div><label>电话:</label><input type="tel" name="phone" data-ideal="phone"/></div>
         
        </section>

        <section name="选填栏目1">
        	<div><label>邮箱:</label><input id="email" name="email" data-ideal="email" type="email"/></div>
          	 <div><label>注册身份:</label>
            <label><input type="radio" name="roleId" value="1" checked="checked"/>学生</label>
            <label><input type="radio" name="roleId" value="2"/>老师</label>
            <label><input type="radio" name="roleId" value="3"/>管理员</label>
          </div>
        </section>

        <section name="选填栏目2">
        
          <div><label>学校:</label> <input type="text" name="university" id="university"></div>
          <div><label>学院:</label><input type="text"
					name="institute" id="institute"></div>
          <div><label>年纪:</label><input type="text" name="grade"
					id="grade"></div>
          <div><label>专业:</label><input type="text" name="major"
					id="major"></div>
          <div><label>班级:</label><input type="text" name="classes" id="classes"/></div>
      
      </section>

      <div><hr/></div>

      <div>
      	<label>验证码：</label>&nbsp;&nbsp;
      	<input type="text"
					name="securityCode" size="5" maxlength="4" /><img
					src="securityCodeImage" id="Verify" style="cursor:hand"
					alt="看不清，换一张" width="60" height="30" /><br><br><br>
        <button type="submit" id="submit">注册</button>
        <button id="reset" type="button">重置</button>
      </div>

    </form>

    <!-- End Form -->

  </div>

</div>



<script type="text/javascript">
var options = {

	onFail: function(){
		alert( $myform.getInvalid().length +' invalid fields.' )
	},

	inputs: {
		'username': {
			filters: 'required',
		},
		'password': {
			filters: 'required',
		},
		
		'confirmPassword': {
			filters: 'required',
		},
		'phone':{
			filters: 'required',
		},
		
		
		
		
	}
	
};

var $myform = $('#my-form').idealforms(options).data('idealforms');

$('#reset').click(function(){
	$myform.reset().fresh().focusFirst()
});

$myform.focusFirst();
</script>




</body>


</html>
